<template>
    <el-button type="success" @click="batchExportExcel">批量导出(Excel)</el-button>
    <el-button type="danger" @click="chooseExportExcel">选择导出(Excel)</el-button>
    <el-button type="danger" @click="simpleBatchExportExcel">导出当前页面数据(Excel)</el-button>
    <el-table :data="customerPageInfo.list" style="width: 100%" @selection-change="selectId">
        <el-table-column type="selection" width="50" />
        <el-table-column type="index" label="序号" width="65" />
        <el-table-column property="ownerName" label="负责人" width="120" />
        <el-table-column property="activityName" label="所属活动" />
        <el-table-column label="姓名">
            <template #default="scope">
                <a href="javascript:void(0)" @click="view(scope.row.id)">{{ scope.row.fullName }}</a>
            </template>
        </el-table-column>
        <el-table-column property="appellationTypeValue" label="称呼" width="120" />
        <el-table-column property="phone" label="手机" width="120" />
        <el-table-column property="weixin" label="微信" width="120" />
        <el-table-column property="needLoanTypeValue" label="是否贷款" width="120" />
        <el-table-column property="intentionStateTypeValue" label="意向状态" />
        <el-table-column property="stateTypeValue" label="线索状态" />
        <el-table-column property="sourceTypeValue" label="线索来源" />
        <el-table-column property="intentionProductName" label="意向产品" />
        <el-table-column property="nextContactTime" label="下次联系时间" width="165" />
    </el-table>
    <el-pagination background layout="prev,pager, next, jumper, total" :total="customerPageInfo.total"
        :page-size="customerPageInfo.pageSize" @change="toPage" />
</template>
<script setup>
import { inject, onMounted, ref } from 'vue'
import { doGet, doDownload } from '@/http/httpRequest'
import { showMessage } from "../util/message";
import { useRouter, useRoute } from 'vue-router';
import { saveAs } from 'file-saver';

let idArry = [];

let customerPageInfo = ref({})

let router = useRouter()

let pageNum = ref();

onMounted(() => {
    loadCustomerList(1);
})

const loadCustomerList = (current) => {
    pageNum.value = current;
    doGet('/api/customer', { current: current }).then(resp => {
        if (resp) {
            if (resp.data.code === 200) {
                customerPageInfo.value = resp.data.info;
            } else {
                showMessage('数据加载失败', 'error');
            }
        }
    })
}

//分页
const toPage = (currentPage, pageSize) => {
    loadCustomerList(currentPage);
}


//批量导出
const batchExportExcel = () => {
    doDownload('/api/exportExcel', { ids: '' }).then(resp => {
        //使用file-saver下载文件
        saveAs(new Blob([resp.data]), '客户信息列表' + Date.now().toString() + '.xlsx')
    }).catch(error => {
        showMessage('导出失败', 'error')
    })
}

const selectId = (item) => {//item是一个类，不能只看浏览器console输出的东西
    idArry = [];
    for (let index in item) {
        idArry.push(item[index].id)
    }
}

//选择导出
const chooseExportExcel = () => {
    if (idArry.length <= 0) {
        showMessage('请选择要导出的数据！', 'error');
    } else {
        doDownload('/api/exportExcel', { ids: idArry.join(',') }).then(resp => {
            //使用file-saver下载文件
            saveAs(new Blob([resp.data]), '客户信息列表' + Date.now().toString() + '.xlsx')
        }).catch(error => {
            showMessage('导出失败', 'error')
        })
    }
}

//简易导出
const simpleBatchExportExcel = () => {
    doDownload('/api/exportExcel', { ids: idArry.join(','), pageNum: pageNum.value }).then(resp => {
        //使用file-saver下载文件
        saveAs(new Blob([resp.data]), '客户信息列表' + Date.now().toString() + '.xlsx')
    }).catch(error => {
        showMessage('导出失败', 'error')
    })
}

//详情
const view = (id) => {
    router.push('/dashboard/customer/' + id)
}


</script>
<style scoped></style>